<!--********************************************************************
* Copyright© 2000 - 2018 SuperMap Software Co.Ltd. All rights reserved.
*********************************************************************-->
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title data-i18n="resources.title_controlerLayerSwitcher"></title>
    <script type="text/javascript" src="../js/include-web.js"></script>
    <script type="text/javascript" include="layerswitcher" src="../../dist/openlayers/include-openlayers.js"></script>
</head>
<body style=" margin: 0;overflow: hidden;background: #fff;width: 100%;height:100%">
<div id="map" style="width: 100%;height:100%"></div>
<script type="text/javascript">
    var host = window.isLocal ? window.server : "http://support.supermap.com.cn:8090";
    var map,
        China = host + '/iserver/services/map-china400/rest/maps/China',
        ChinaDark = host + '/iserver/services/map-china400/rest/maps/ChinaDark';
    map = new ol.Map({
        layers: [
            new ol.layer.Group({
                'title': resources.text_switchLayer,
                layers: [
                    new ol.layer.Tile({
                        title: 'China',
                        type: 'base',
                        visible: true,
                        source: new ol.source.TileSuperMapRest({
                            url: China
                        }),
                    }),
                    new ol.layer.Tile({
                        title: 'ChinaDark',
                        type: 'base',
                        visible: false,
                        source: new ol.source.TileSuperMapRest({
                            url: ChinaDark
                        }),

                    })
                ]
            }),
        ],
        target: 'map',
        controls: ol.control.defaults({attributionOptions: {collapsed: false}}),
        view: new ol.View({
            center: [100, 38],
            projection: 'EPSG:3857',
            zoom: 3
        }),
    });
    var layerSwitcher = new ol.control.LayerSwitcher({});
    map.addControl(layerSwitcher);
</script>
</body>
</html>